import React from 'react';
import {
    View,
    Text,
    ScrollView,
    TouchableOpacity, Image, ImageBackground, Dimensions, StyleSheet, DeviceEventEmitter, Linking,
} from 'react-native';
import {
    InputItem,
    List,
    Switch,
    ActionSheet,
    DatePicker,
    TextareaItem,
    Button, Modal,
} from '@ant-design/react-native';
import Dict from '../../../common/Dict';
import FormItem from "../../../common/components/FormItem";
import FormRadioItem from "../../../common/components/FormRadioItem";
import GlobalStyles from "../../../common/styles/GlobalStyles";
import PickerViewModalCas from '../../../common/components/PickerViewModalCas';
import PersonalDialog from '../../dialogComponents/PersonalDialog'
import ChooseDeptDialog from '../../dialogComponents/ChooseDeptDialog'
import StorageUtil from '../../../utils/StorageUtil';
import {Constant} from '../../../common/Constant';
import Utils from '../../../utils/Utils';
import {BASE_URL} from '../../../common/BASE_URL';
import HttpUtils from "../../../expand/dao/HttpUtils";
import ToastUtil from "../../../utils/ToastUtil";
import NavigationUtil from "../../../navigators/NavigationUtil";
import NavigationBar from "../../../common/NavigationBar";
const screenWidth = Dimensions.get('window').width;

const queryCheckTypeListUrl =  BASE_URL.apiBaseUrl + '/api/checkType/list'
const queryXunchaListUrl = BASE_URL.apiBaseUrl + '/api/checkItems'
const queryDocumentType = BASE_URL.apiBaseUrl + '/api/flowLink/initLink'
const getFlowLinkList = BASE_URL.apiBaseUrl + '/api/flowLink/list'
// 所有角色
const getAllRole = BASE_URL.apiBaseUrl + '/api/roles/all'
// 所有人员
const getAllOfficer = BASE_URL.apiBaseUrl + '/api/enforcementOfficer/noDataScopes'
// 按钮
const getBtnInfoUrl = BASE_URL.apiBaseUrl + '/api/flowLinkHandle/findById'
const caseTxetByCode = BASE_URL.apiBaseUrl + '/api/text/list'

export default class CaseDocument extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            documentType: '2',// 文书类型 1案件文书，2制作文书
            documentList: [],
            documentBtnList: [],
            activeBtns: [],
            sexDict: [],
            idTypeDict: [],
            checkTypeList: [],
            xunchaList: [],
            showDatePicker: false,
            // 角色、用户、部门
            roleSelectList: [], // 环节角色选项
            officerSelectList: [], // 环节执法员选项
            deptSelectList: [], // 环节部门选项
            cacheFlowLink: {},// 缓存步骤对象
            cacheNextLinkList: [],// 缓存
            // 巡查任务表单内容
            inspectionPendingMatter: {
                nextHandlerDeptList: [], // 部门限制选项 item.depts
                nextHandlerRoleList: [], // 角色限制选项 item.roles
                nextHandlerOfficerList: [], // 执法人员限制选项 item.officers
                nextHandlerDeptIds: [],
                nextHandlerRoleIds: [],
                nextHandlerOfficerIds: [],
                nextHandlerOfficerNames: '',
                caseActionRecord: {
                    nextHandlerDepts: '',
                    nextHandlerRoles: '',
                    nextHandlerOfficers: '',
                    stateId: '',
                    linkId: '',
                    linkName: '',
                    linkHandleName: '',
                    handlerOpinions: ''
                }
            },
            casePendingMatter: {
                handleType: '',
                id: '',
                stateId: '',
                linkId: '',
                linkName: '',
                timeLimit: '',
                // 页面选择使用
                nextHandlerDeptList: [], // 部门限制选项 item.depts
                nextHandlerRoleList: [], // 角色限制选项 item.roles
                nextHandlerOfficerList: [], // 执法人员限制选项 item.officers
                // 选中的数据
                nextHandlerDeptIds: [],
                nextHandlerRoleIds: [],
                nextHandlerOfficerIds: [],
                isBranch: '',
                caseActionRecord: {
                    nextHandlerDepts: '',
                    nextHandlerRoles: '',
                    nextHandlerOfficers: '',
                    stateId: '',
                    linkId: '',
                    linkName: '',
                    linkHandleName: '',
                    handlerOpinions: ''
                }
            },
            caseInfoVo: {},
            document: {},
        };
    }

    //
    async componentDidMount(){
        // const gender = await Dict.getDict('dict_gender')
        // const idType = await Dict.getDict('id_type')
        // this.initDocumentType()
        // this.initRoleAndOfficer()
        this.documentListen = DeviceEventEmitter.addListener(
            'addDocumentInfo',
            (events) => {
                const list = this.state.documentList
                //新增：1,详情：2 ,编辑：3
                if(events.type==1){//新增：1
                    list.push({
                        ...events.textForm
                    })
                }else if(events.type==3){//编辑
                    list[events.index]=events.textForm
                }
                this.setState({
                    documentList: list
                })
                this.props.onChange && this.props.onChange(list)
            },
        );
        //刷新文书列表
        this.resetCaseListen= DeviceEventEmitter.addListener(
            "resetCase",()=>{
                let caseCode=this.props.caseCode
                HttpUtils.request({
                    url: caseTxetByCode,
                    params: {caseCode}
                }).then(res=>{
                    this.props.onChanges && this.props.onChanges(res)
                })
            }
        )
        this.resetCaseListen= DeviceEventEmitter.addListener(
            "addCasepath",(res)=>{
                let list=JSON.parse(JSON.stringify(this.state.documentList)) 
                list[res.index].wsPath=res.path
                this.setState({
                    documentList:list
                })
            }
        )
    }
    componentWillUnmount() {
        this.documentListen && this.documentListen.remove();
        this.resetCaseListen && this.resetCaseListen.remove();
    }

    initRoleAndOfficer(){
        HttpUtils.request({
            url: getAllRole
        }).then(res=>{
            this.state.roleSelectList = res
        })
        const key = ToastUtil.loading('加载中...')
        HttpUtils.request({
            url: getAllOfficer
        }).then(res=>{
            ToastUtil.remove(key)
            this.state.officerSelectList = res.content
            // this.initHandleLinkList(321,true)
            this.initCaseBtn()
        }).catch(e=>{
            ToastUtil.remove(key)
        })


    }
    initCaseBtn(){
        // 默认巡查任务信息
        HttpUtils.request({
            url: getBtnInfoUrl,
            params:{
                id: 321
            }
        }).then(item=>{
            const {id,nextLinks} = item
            if(this.state.activeBtns.includes(id)){
                //
            }else{
                this.state.activeBtns = [id]
                // 判断是否存在下一步环节
                let nextStepObj = null
                if(nextLinks){
                    this.initHandleLinkList(nextLinks,true);
                }else{ // 最后一步环节
                    // caseActionRecord
                    const {cacheFlowLink} = this.state
                    nextStepObj = {
                        stateId: cacheFlowLink.stateId,
                        linkId: cacheFlowLink.id,
                        linkName: cacheFlowLink.name,
                        linkHandleName: cacheFlowLink.linkHandleName,
                        handlerOpinions: "",
                    }
                }
                const copyItem = JSON.parse(JSON.stringify(item))
                copyItem.id = ''
                this.setState({
                    activeBtns: this.state.activeBtns,
                    inspectionPendingMatter: {
                        ...this.state.inspectionPendingMatter,
                        caseActionRecord: nextStepObj?nextStepObj:this.state.inspectionPendingMatter,
                        ...copyItem,
                    }
                })
                this.props.onChange && this.props.onChange({
                    inspectionPendingMatter: this.state.inspectionPendingMatter,
                    casePendingMatter: this.state.casePendingMatter
                })
            }
        }).catch(e=>{
            console.log(e)
        })
    }

    initDocumentType(){
        HttpUtils.request({
            url: queryDocumentType,
            params: {flowType: 1}
        }).then(res=>{
            // this.state.documentBtnList = res.children
            if(res){
                // 缓存对象
                // this.state.cacheFlowLink = res
                this.setState({
                    cacheFlowLink: res,
                    documentBtnList: res.children
                })
            }
        }).catch(e=>{
            console.log(e)
        })
    }


    initHandleLinkList(links, flag){
        HttpUtils.request({
            url: getFlowLinkList,
            params: {ids: links}
        }).then(res=>{
            // 缓存
            if(flag){
                console.log(res);
            }
            this.state.cacheNextLinkList = res
            const {cacheFlowLink,cacheNextLinkList,casePendingMatter,roleSelectList,officerSelectList} = this.state
            const {handleType} = casePendingMatter
            const obj = {
                stateId: cacheFlowLink.stateId, // 获取当前操作 阶段
                linkId: cacheFlowLink.id, // 获取当前操作 环节
                linkName: cacheFlowLink.name, // 获取当前操作, 环节名称
                linkHandleName: casePendingMatter.name, // 获取当前操作，处理方式
            }
            if(handleType === 2){
                // todo
            }else{
                const item = cacheNextLinkList[0]
                if(!item) return
                let isBranch = !this.props.pendingMattersId? 0: null
                // 角色
                let rolesVal = item.roles?(item.roles.split(",").map((id) => parseInt(id))): []
                const roleoptions2 = [];
                for (let i = 0, len = rolesVal.length; i < len; i++) {
                    for (let j = 0, len2 = roleSelectList.length; j < len2; j++) {
                        if (rolesVal[i] === roleSelectList[j].id) {
                            roleoptions2.push(roleSelectList[j]);
                            break;
                        }
                    }
                }
                // 人员
                let officersVal = item.officers?item.officers.split(",").map((id) => parseInt(id)): []
                const officeroptions2 = [];
                const officerRecord = [];
                if(flag){
                    for (let j = 0, len2 = officerSelectList.length; j < len2; j++) {
                        officeroptions2.push(officerSelectList[j]);
                        officerRecord.push(officerSelectList[j].name);
                    }
                }else{
                    for (let i = 0, len = officersVal.length; i < len; i++) {
                        for (let j = 0, len2 = officerSelectList.length; j < len2; j++) {
                            if (officersVal[i] === officerSelectList[j].officerId) {
                                officeroptions2.push(officerSelectList[j]);
                                officerRecord.push(officerSelectList[j].name);
                                break;
                            }
                        }
                    }
                }
                const caseActionRecord = {
                    nextHandlerDepts: item.depts,
                    nextHandlerRoles: item.roles,
                    nextHandlerOfficers: officerRecord.toString(),
                    stateId: cacheFlowLink.stateId, // 获取当前操作 阶段
                    linkId: cacheFlowLink.id, // 获取当前操作 环节
                    linkName: cacheFlowLink.name, // 获取当前操作, 环节名称
                    linkHandleName: casePendingMatter.name, // 获取当前操作，处理方式
                    handlerOpinions: ""
                };

                // console.log(officeroptions2)
                const stateObj = flag?'inspectionPendingMatter':'casePendingMatter'
                this.setState({
                    [stateObj]:{
                        ...this.state[stateObj],
                        id: this.props.pendingMattersId,// 父页面传递过来
                        stateId: item.stateId,
                        linkId: item.id,
                        linkName: item.name,
                        timeLimit: item.timeLimit,
                        nextHandlerDeptList: [], // 部门限制选项 item.depts
                        nextHandlerRoleList: roleoptions2, // 角色限制选项 item.roles
                        nextHandlerOfficerList: officeroptions2, // 执法人员限制选项 item.officers
                        nextHandlerDeptIds: [],
                        nextHandlerRoleIds: [],
                        nextHandlerOfficerIds: [],
                        nextHandlerOfficerNames: '',
                        isBranch: isBranch,
                        caseActionRecord: caseActionRecord
                    }
                })
                this.props.onChange && this.props.onChange({
                    inspectionPendingMatter: this.state.inspectionPendingMatter,
                    casePendingMatter: this.state.casePendingMatter
                })
            }


        })
    }
    _changeActiveBtns(item){
        const {id,nextLinks} = item
        if(this.state.activeBtns.includes(id)){
            // const idx = this.state.activeBtns.indexOf(id)
            // this.state.activeBtns.splice(idx,1)
        }else{
            this.state.activeBtns = [id]
            // 判断是否存在下一步环节
            let nextStepObj = null
            if(nextLinks){
                this.initHandleLinkList(nextLinks);
            }else{ // 最后一步环节
                // caseActionRecord
                const {cacheFlowLink} = this.state
                nextStepObj = {
                    stateId: cacheFlowLink.stateId,
                    linkId: cacheFlowLink.id,
                    linkName: cacheFlowLink.name,
                    linkHandleName: cacheFlowLink.linkHandleName,
                    handlerOpinions: "",
                }
                // const flowLink = this.flowLink; // 获取当前操作, 环节名称
                // const linkHandleName = this.flowLinkHandle.name; // 获取当前操作，处理方式
                // id = this.pendingMattersId;
            }
            const copyItem = JSON.parse(JSON.stringify(item))
            copyItem.linkHandleName = copyItem.name
            copyItem.id = ''
            this.setState({
                activeBtns: this.state.activeBtns,
                casePendingMatter: {
                    ...this.state.casePendingMatter,
                    caseActionRecord: nextStepObj?nextStepObj:this.state.casePendingMatter,
                    ...copyItem,
                }
            })
            this.props.onChange && this.props.onChange({
                inspectionPendingMatter: this.state.inspectionPendingMatter,
                casePendingMatter: this.state.casePendingMatter
            })
        }

    }
    _delDocument(index){
        Modal.alert('提示', '确认删除文书？', [
            {
                text: '取消',
                // onPress: () => console.log('cancel'),
                style: 'cancel',
            },
            {
                text: '确认',
                onPress: () => {
                    this.state.documentList.splice(index, 1)
                    this.setState({
                        documentList: this.state.documentList
                    })
                },
            },
        ]);
        return;

    }
    _renderShowDocument(){
        const {documentList} = this.state
        let avoidCaseList=this.props.avoidCaseList
        let caseDomList=[...documentList,...avoidCaseList]
        const views = []
        if(caseDomList.length > 0){
            caseDomList.map((item,index)=>{
                views.push(
                    <View key={index+'_show_document'} style={{width: screenWidth/2 - 30,
                    alignItems: 'center',marginBottom: 15,display:'flex',flexDirection:'column',justifyContent:'space-between'}}>
                        
                        <TouchableOpacity
                           onPress={()=>{
                                NavigationUtil.goPage('MakeCaseDocumentForm', {
                                    item: item,
                                    dataIndex:index,
                                    type:2 //新增：1,详情：2 ,编辑：3
                                });
                            }}
                        >
                            <ImageBackground
                                key={index}
                                style={{ width: 144,
                                height: 186,
                                alignItems: 'center',
                                padding: 20,
                                paddingTop: 20,
                                }}
                                source={require('../../../assets/images/report/document_bg1.png')}
                            >
                                <Text style={{color: '#fff',fontSize: 14,
                                marginBottom: 5,flex:1,
                                paddingTop:10,
                                textAlign:"center",
                                display:'flex',justifyContent:'center',alignItems:'center',
                                }}>{item.name}</Text>
                                <Text style={{width: 110,backgroundColor: 'rgba(255,255,255,0.8)',
                                padding: 2,fontSize: 14,color: '#193685',textAlign: 'center',height:70
                                }}>
                                {item.number}
                                </Text>
                            </ImageBackground>
                        </TouchableOpacity>
                        <View style={{flexDirection: 'row',width: 144,marginTop: 10}}>
                            {item.wsPath?
                                <TouchableOpacity
                                    style={{flex: 1,borderWidth: 1,borderColor: '#FFBB4E',borderRadius: 7,marginRight:5,}}
                                    onPress={()=>{
                                        NavigationUtil.goPage('LookCasePdf', {
                                            item:item,
                                            Url:item.wsPath
                                        });
                                    }}
                                >
                                    <Text style={{color: '#FFBB4E',textAlign: 'center',fontSize:12}}>预览文书</Text>
                                </TouchableOpacity>:
                                (!item.id?<TouchableOpacity
                                    style={{flex: 1,borderWidth: 1,borderColor: '#FFBB4E',borderRadius: 7,marginRight:5,}}
                                    onPress={()=>{
                                        NavigationUtil.goPage('MakeCaseDocumentForm', {
                                            item:item,
                                            index:index,
                                            type:3 //新增：1,详情：2 ,编辑：3
                                        });
                                    }}
                                >
                                    <Text style={{color: '#FFBB4E',textAlign: 'center',fontSize:12}}>编辑文书</Text>
                                </TouchableOpacity>:null)
                            }
                            {!item.id?<TouchableOpacity
                                style={{flex: 1,borderWidth: 1,borderColor: '#FFBB4E',borderRadius: 7,marginRight:5,}}
                                onPress={()=>this._delDocument(index)}
                            >
                                <Text style={{color: '#FFBB4E',textAlign: 'center',fontSize:12}}>删除文书</Text>
                            </TouchableOpacity>:null}
                            {/* <TouchableOpacity style={{flex: 1,borderWidth: 1,borderColor: '#FFBB4E',borderRadius: 7,marginLeft:5}}>
                                <Text style={{color: '#FFBB4E',textAlign: 'center'}}>录入指纹</Text>
                            </TouchableOpacity> */}
                        </View>
                    </View>
                )
            })
        }else{
            views.push(
                <View key={'no_data'} style={{backgroundColor: 'rgba(25, 54, 133, 0.2)',flex: 1}}>
                    <Text style={{textAlign: 'center',padding: 15,fontSize: 16,color: '#193685',borderRadius:7,}}>暂无相关文书</Text>
                </View>
            )
        }
        return (<View style={{padding: 10,flexDirection: 'row',flexWrap: 'wrap'}}>
            {views}
        </View>)
    }
    _renderUpdateDocument(){
        const {casePendingMatter} = this.props.documentInfo
        const caseInfo=this.props.caseInfo
        const caseLitigants=this.props.caseLitigants
        // const {activeBtns, documentBtnList, casePendingMatter} = this.state
        const views = []
        // const documents = ['当场行政处罚决定书','现场检验（勘验）笔录']
        const documentsStr =  casePendingMatter ? casePendingMatter.documentRequired : ''
       
        if(documentsStr){
            const documents = JSON.parse(documentsStr)
            console.log("documentsStr",documents)
            documents.map((item,index)=>{
                views.push(
                    <View key={index+'_document_file'} style={{width: screenWidth/2 - 30,alignItems: 'center',marginBottom: 15}}>
                        <TouchableOpacity
                            onPress={()=>{
                                NavigationUtil.goPage('MakeCaseDocumentForm', {
                                    item: item,
                                    caseInfo:caseInfo,
                                    caseLitigants:caseLitigants,
                                    type:1 //新增：1,详情：2 ,编辑：3
                                });
                            }}
                        >
                            <ImageBackground
                                key={index}
                                style={{width: 144,height: 186,alignItems: 'center',padding: 20,paddingTop: 20}}
                                source={require('../../../assets/images/report/document_bg.png')}
                            >
                                {/*24 *  #e80505c9  6 31*/}
                                {
                                    item.isRequird==1?
                                    <Text style={{color: '#fff',fontSize: 16,textAlign: 'center',paddingTop: 25}}>
                                         <Text style={{color: 'red',paddingRight:10}}>* </Text>
                                        {item.name}</Text>:
                                    <Text style={{color: '#fff',fontSize: 16,textAlign: 'center',paddingTop: 25}}>
                                        {item.name}
                                    </Text>
                                }

                            </ImageBackground>
                        </TouchableOpacity>
                    </View>
                )
            })
        }else{
            views.push(<View key={'no_data'} style={{backgroundColor: 'rgba(25, 54, 133, 0.2)',flex: 1}}>
                <Text style={{textAlign: 'center',padding: 15,fontSize: 16,color: '#193685',borderRadius:7,}}>暂无相关文书</Text>
            </View>)
        }
        return (<View>
            <View style={{flex: 1,paddingTop: 10,paddingBottom: 10}}>
                <View style={{padding: 10,flexDirection: 'row',flexWrap: 'wrap'}}>
                    {views}
                </View>
            </View>
        </View>)
    }

    _changeOpinions(value){
        this.state.casePendingMatter.caseActionRecord.handlerOpinions = value
        this.setState({casePendingMatter: this.state.casePendingMatter});
        this.props.onChange && this.props.onChange({
            inspectionPendingMatter: this.state.inspectionPendingMatter,
            casePendingMatter: this.state.casePendingMatter
        })
    }
    showCaseOfficeActionSheet(){
        const list = this.state.inspectionPendingMatter.nextHandlerOfficerList
        const labels = list.map((item) => item.name);
        labels.push('关闭');
        const values = list.map((item) => item.officerId);
        ActionSheet.showActionSheetWithOptions(
            {
                options: labels,
                destructiveButtonIndex: labels.length - 1,
                maskClosable: true,
                height: 300
            },
            (index) => {
                if (labels[index] === '关闭') {
                    return false;
                }
                const data = Object.assign({}, this.state.inspectionPendingMatter, {
                    nextHandlerOfficerNames: labels[index],
                    nextHandlerOfficerIds: [values[index]],
                });
                this.setState({inspectionPendingMatter: data});
                this.props.onChange && this.props.onChange({
                    inspectionPendingMatter: this.state.inspectionPendingMatter,
                    casePendingMatter: this.state.casePendingMatter
                })
                // fn && fn(values[index])
            },
        );
    }

    showOfficeActionSheet(){
        const list = this.state.casePendingMatter.nextHandlerOfficerList
        const labels = list.map((item) => item.name);
        labels.push('关闭');
        const values = list.map((item) => item.officerId);
        ActionSheet.showActionSheetWithOptions(
            {
                options: labels,
                destructiveButtonIndex: labels.length - 1,
                maskClosable: true,
            },
            (index) => {
                if (labels[index] === '关闭') {
                    return false;
                }
                const data = Object.assign({}, this.state.casePendingMatter, {
                    nextHandlerOfficerNames: labels[index],
                    nextHandlerOfficerIds: [values[index]],
                });
                this.setState({casePendingMatter: data});
                this.props.onChange && this.props.onChange({
                    inspectionPendingMatter: this.state.inspectionPendingMatter,
                    casePendingMatter: this.state.casePendingMatter
                })
                // fn && fn(values[index])
            },
        );
    }

    render() {
        const {navigation} = this.props;
        const {documentType} = this.state
        return (

            <View style={[GlobalStyles.innerTabPanel,{flexDirection: 'column',flex: 1}]}>
                {this._renderHeaderBtns()}
                <ScrollView
                    style={{flex: 1}}
                    automaticallyAdjustContentInsets={false}
                    showsHorizontalScrollIndicator={false}
                    showsVerticalScrollIndicator={false}>
                    {documentType === '1'? this._renderShowDocument():this._renderUpdateDocument()}
                </ScrollView>
            </View>
        );
    }
    // 级联检查类型
    _queryCheckTypeList(value){
        // queryCheckTypeListUrl
        HttpUtils.request({
            url: queryCheckTypeListUrl,
            params: {
                caseRelatedIndustries: value
            }
        }).then(res=>{
            if(!res.status){
                this.setState({
                    checkTypeList: res
                })
            }
        })

    }
    // 级联巡查事项
    _queryXunchaList(value){
        HttpUtils.request({
            url: queryXunchaListUrl,
            params: {
                caseRelatedIndustries: value
            }
        }).then(res=>{
            if(!res.status){
                this.setState({
                    xunchaList: res.content
                })
            }
        })
    }

    async showDictActionSheet(key,label,value,fn){
        let dict = await Dict.getDict(key);
        const labels = dict.map((item) => item.label);
        labels.push('关闭');
        const values = dict.map((item) => item.value);
        ActionSheet.showActionSheetWithOptions(
            {
                options: labels,
                destructiveButtonIndex: labels.length - 1,
                maskClosable: true,
            },
            (index) => {
                if (labels[index] === '关闭') {
                    return false;
                }
                const data = Object.assign({}, this.state.caseInfoVo, {
                    [label]: labels[index],
                    [value]: values[index],
                });
                this.setState({caseInfoVo: data});
                fn && fn(values[index])
            },
        );
    }


    _renderHeaderBtns(){
        const {documentType} = this.state
        return (
            <View style={{flexDirection: 'row'}}>
                <TouchableOpacity
                    style={[
                        {flex: 1,justifyContent: 'center',borderTopLeftRadius: 5,borderBottomLeftRadius: 5,padding: 8},
                        documentType==='1'?{ backgroundColor: '#4D70CC' }: {borderColor: '#4D70CC',borderWidth: 1}
                    ]}
                    onPress={()=>{
                        if(this.state.documentType === '2'){
                            this.setState({
                                documentType: '1'
                            })
                        }
                    }}
                >
                    <Text style={[
                        {textAlign: 'center'},
                        documentType==='1'?{ color: '#fff' }:{color: '#4D70CC'}
                    ]}>案件文书</Text>

                </TouchableOpacity>
                <TouchableOpacity
                    style={[
                        {flex: 1,justifyContent: 'center',borderTopRightRadius: 5,borderBottomRightRadius: 5,padding: 8},
                        documentType==='2'?{ backgroundColor: '#4D70CC' }: {borderColor: '#4D70CC',borderWidth: 1}
                    ]}
                    onPress={()=>{
                        if(this.state.documentType === '1'){
                            this.setState({
                                documentType: '2'
                            })
                        }
                    }}
                >
                    <Text style={[
                        {textAlign: 'center'},
                        documentType==='2'?{ color: '#fff' }: {color: '#4D70CC'}
                    ]}>制作文书</Text>
                </TouchableOpacity>
            </View>
        )
    }

}

const styles = StyleSheet.create({
    chooseItem:{
        paddingTop: 5,
        paddingBottom: 5,
        paddingLeft: 10,
        paddingRight: 10,
        borderWidth: 1,
        borderColor: 'rgba(224, 224, 224, 1)',
        borderRadius: 5,
        marginLeft: 12,
        marginBottom: 12
    },
    chooseItemLabel:{
        color: '#8F8F8F',
        fontSize: 14,
    },
    chooseActiveItem: {
        backgroundColor: 'rgba(77, 112, 204, 0.17)',
        borderColor: '#4D70CC'
    },
    labelActive:{
        color: '#4D70CC',
    },



    wordRow:{
        height:30
    }
})
